<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
        <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
        <title>通讯录</title>
        <link rel="stylesheet" type="text/css" href="../../css/aui-win.css" />
        <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
        <link rel="stylesheet" href="../../script/ccssoft/css/ccssoft-lite.css" />
        <style>
        input.search_h {
		    width: 75%;
		    height: 30px;
		    vertical-align:middle;
		    text-align:center;
		    margin-top:15px;
		    /*background:#efefef;*/

		}
		button.button_s{
		  	width: 15%;
		    height: 40px;
		    vertical-align:middle;
		    text-align:center;
		}
        </style>
    </head>
    <body>
        <header class="aui-bar aui-bar-nav ccssoft-aui-bar-theme" id="header">
            <a class="aui-btn ccssoft-aui-bar-theme aui-pull-left" id="back" tapmode=""> <span class="aui-iconfont aui-icon-left"></span> </a>
            <!-- <a class="aui-btn ccssoft-aui-bar-theme aui-pull-right" tapmode="" onclick="showPopup()"><span class="aui-iconfont aui-icon-search"></span> </a> -->
            <div class="aui-title">通讯录</div>
        </header>
        <div style="text-align:center;">
        		<span><input class="search_h" type="text" placeholder="请输入姓名" id="input"/></span>
        		<span> <button class="aui-btn-info" style="height: 30px; margin-top: 0px;" onclick="search();" tapmode >搜索</button> </span>
        </div>
        <script src="../../script/jquery-1.11.3.min.js"></script>
        <script type="text/javascript" src="../../script/api.js"></script>
        <script type="text/javascript" src="../../script/debug.js"></script>
        <script type="text/javascript" src="../../script/common.js"></script>
        <script type="text/javascript">
            var frmName = "contact-listDetail";
            apiready = function() {
                var header = $api.byId('header');
                $api.fixIos7Bar(header);
                var headerPos = $api.offset(header);
                var body_h = $api.offset($api.dom('body')).h;

                api.parseTapmode();
                var search_h= 55;
//              $('input').bind('input propertychange', function() {
////				 //进行相关操作
//					window.setTimeout(function(){
//						var username = $api.byId('input').value;
//				 		showlog('input propertychange'+ $api.byId('input').value);
//					 	if(typeof(username)!="undefined" && username!=null ){
//					 		var formData ={ name:username};
//				            transferObj(formData, {
//				                winName : 'contact-list',
//				                frameName : 'contact-listDetail'
//				            }, 'queryContact');
//					 	}
//					},500);
//
//
//				});
                api.openFrame({
                    name : frmName,
                    url : 'contact-listDetail.html',
                    bounces : false,
                    pageParam : api.pageParam,
                    rect : {
                        x : 0,
                        y : headerPos.h,
                        w : headerPos.w,
                        h : 'auto'
                    }
                });
                $api.addEvt($api.byId('back'), 'click', function() {
                    api.closeWin();
                });
            };
            // 打开查询工单页面
            function showPopup() {
            		var pageParam ={};
                pageParam.winName = api.winName;
                pageParam.frameName = 'contact-listDetail';
                pageParam.callback = 'queryContact';
                api.openFrame({
                    name : 'popup_query_frm',
                    url : 'contact_query.html',
                    rect : {
                        x : 0,
                        y : 0,
                        w : 'auto',
                        h : 'auto'
                    },
                    bounces : false,
                    pageParam : pageParam
                });
            }

            function search (){
              
            }
        </script>
    </body>
</html>
